<template>
  <div id="addReport">
    <div class="header" style="text-align: left;padding: 10px 40px;">
      <el-button type="primary" @click="goBack">返回</el-button>
    </div>
    <div class="main">
      <el-form :label-position="labelPosition" label-width="120px" :model="formLabelAlign">

        <el-form-item label="联系人姓名">
          <el-input v-model="formLabelAlign.name"></el-input>
        </el-form-item>
        <el-form-item label="联系人手机号">
          <el-input v-model="formLabelAlign.phone"></el-input>
        </el-form-item>
        <el-form-item label="商户名称">
          <el-input v-model="formLabelAlign.mchtName"></el-input>
        </el-form-item>
        <el-form-item label="后台商户号">
          <el-input v-model="formLabelAlign.userId"></el-input>
        </el-form-item>
        <el-form-item label="密匙">
          <el-input v-model="formLabelAlign.key"></el-input>
        </el-form-item>
        <el-form-item label="客服电话">
          <el-input v-model="formLabelAlign.mchtPhone"></el-input>
        </el-form-item>
        <el-form-item label="经营类型">
          <el-input v-model="formLabelAlign.manageType"></el-input>
        </el-form-item>
        <el-form-item label="经营类目">
          <el-input v-model="formLabelAlign.manageId"></el-input>
        </el-form-item>
        <el-form-item label="商户备注">
          <el-input v-model="formLabelAlign.merMark"></el-input>
        </el-form-item>
        <el-form-item label="商户地址">
          <el-input v-model="formLabelAlign.merAddr"></el-input>
        </el-form-item>
        <el-form-item label="法人姓名">
          <el-input v-model="formLabelAlign.corporationName"></el-input>
        </el-form-item>
        <el-form-item label="法人身份证号">
          <el-input v-model="formLabelAlign.corporationCertno"></el-input>
        </el-form-item>
        <el-form-item label="开户账户类型">
          <el-input v-model="formLabelAlign.acctType"></el-input>
        </el-form-item>

        <el-form-item label="持卡人姓名">
          <el-input v-model="formLabelAlign.acctName"></el-input>
        </el-form-item>
        <el-form-item label="账户身份证号">
          <el-input v-model="formLabelAlign.IdNumber"></el-input>
        </el-form-item>
        <el-form-item label="开户银行名称">
          <el-input v-model="formLabelAlign.acctBankName"></el-input>
        </el-form-item>
        <el-form-item label="行别号(银行卡信息)">
          <el-input v-model="formLabelAlign.settacctBankno"></el-input>
        </el-form-item>
        <el-form-item label="银行账号(银行卡信息)">
          <el-input v-model="formLabelAlign.acctNo"></el-input>
        </el-form-item>


        <el-form-item label="营业执照工商号">
          <el-input v-model="formLabelAlign.bussAuthNum"></el-input>
        </el-form-item>
        <el-form-item label="省市区">
          <el-cascader :options="options" v-model="selectedOptions" @change="handleChange">
          </el-cascader>
        </el-form-item>
        <el-form-item label="">
          <el-button type="primary" @click="addReport">确认</el-button>
        </el-form-item>
      </el-form>

    </div>

  </div>
</template>

<script>
  import {regionData} from 'element-china-area-data'

  export default {
    data () {
      return {
        labelPosition: 'right',
        formLabelAlign: {
          name: '',
          phone: '',
          mchtName: '',
          mchtPhone: '',
          manageType: '',
          manageId: '',
          merMark: '',
          merAddr: '',
          corporationName: '',
          corporationCertno: '',
          acctType: '',
          acctName: '',
          IdNumber: '',
          acctBankName: '',
          settacctBankno: '',
          acctNo: '',
          bussAuthNum: '',
          provinceCode: '',
          cityCode: '',
          districtCode: '',
          userId: '',
          key: ''
        },
        options: regionData,
        selectedOptions: []

      }
    },
    methods: {
      addReport() {
        let params = JSON.parse(sessionStorage.getItem('classify info'));
        this.formLabelAlign.id = params.id;
        this.$api.postReport(this.formLabelAlign).then(res => {
          if (res.code === '000000') {
            console.log(res.data)
            this.$message({
              type: 'success',
              message: '添加报件成功'
            })
            this.goBack()
          }
        })
      },
      goBack () {
        this.$router.go(-1)
      },
      handleChange (value) {
        this.formLabelAlign.provinceCode = value[0]
        this.formLabelAlign.cityCode = value[1]
        this.formLabelAlign.districtCode = value[2]
      }
    }
  }
</script>

<style lang="less">
  #addReport {
    .main {
      min-width: 400px;
      width: 40%;
      /*margin: auto;*/
    }
  }
</style>
